<div class="modal-dialog" role="document">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="icon-cancel"></i></button>
            <h4 class="modal-title">Add widget</h4>
        </div>
        <div class="modal-body">
            <div class="cluster-widgets-list" data-bind="foreach: widgets">
                <div class="widget-item" data-bind="click: _.partial($root.addWidget, type), css: { disabled: !$root.canAddWidget(type) }">
                    <img data-bind="attr: { src: icon } " />
                    <div class="widget-name" data-bind="text: name"></div>
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button class="btn btn-danger" data-bind="click: addAllWidgets"><i class="icon-plus"></i><span>Add All</span></button>
        </div>
    </div>
</div>
